<template>
	<view class="djs">
		<view class="message-recording">
			<view class="recording-item">
				<view class="item-name">
					总数量
				</view>
				<view class="item-value" style="font-size: 1.1rem;font-weight: bolder;color:rgba(255, 93, 56, 1);margin-top: 20rpx;">
					{{confirmdata.NUM}}个
				</view>
			</view>
			<view class="recording-item">
				<view class="item-name">
					总价格
				</view>
				<view class="item-value" style="font-size: 1.1rem;font-weight: bolder;color:rgba(255, 93, 56, 1);margin-top: 20rpx;">
					{{confirmdata.totalMoney}}元
				</view>
			</view>
		</view>
		<scroll-view scroll-y="true" @scrolltolower="fetchData"
			style="height: 64vh;padding: 10rpx;box-sizing: border-box;">
			<view class="information-data" v-for="(val,inx) in storeInformation" :key="inx">
				<view class="data-item">
					<span class="item-name">核销id:</span><span class="item-value">{{val.id}}</span>
				</view>
				<view class="data-item">
					<span class="item-name">金额:</span><span class="item-value">{{val.value}}元</span>
				</view>
				<view class="data-item">
					<span class="item-name">用户收购幸运卷现金:</span><span
						class="item-value">{{val.acquisitionCashRate}}%</span>
				</view>
				<view class="data-item">
					<span class="item-name">平台收购幸运卷现金:</span><span class="item-value">{{val.platformCashRate}}%</span>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import {
		lotteryshoprecordingPage,
		lotteryshoprecordingcountMap
	} from '@/api/init/api.js'
	export default {
		components: {

		},
		data() {
			return {
				page: 1,
				pageSize: 10,
				loading: false,
				hasMore: true,
				yesShow: false,
				storeInformation: [],
				confirmdata: {}
			}
		},
		created() {
			// this.install()
		},
		methods: {
			fetchData(page, pageSize) {
				// 这里替换为实际的API请求
				if (this.loading || !this.hasMore) return;
				this.loading = true;
				try {
					lotteryshoprecordingPage({
						current: this.page,
						size: this.pageSize,
					}).then(res => {
						console.log(res.data.records);
						if (res.data.records.length > 0) {
							this.storeInformation = this.storeInformation.concat(res.data.records);
							this.page++;
						} else {
							this.hasMore = false;
						}
					})
					console.log(11111);

				} catch (error) {
					console.error('加载数据失败', error);
				} finally {
					this.loading = false;
				}
			},
			install() {
				this.page = 1
				this.pageSize = 10
				lotteryshoprecordingPage({
					current: this.page,
					size: this.pageSize,
				}).then(res => {
					console.log(res.data.records);
					this.storeInformation = res.data.records;

				})
				lotteryshoprecordingcountMap().then(res => {
					this.confirmdata = res.data
					console.log(res.data);
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.djs {
		width: 100%;
		height: 100%;
		background-color: #fff;
	}

	.information-data {
		width: 100%;
		height: 270rpx;
		background-color: #dfdfdf;
		margin-top: 15rpx;
		padding: 10rpx;
		box-sizing: border-box;
	}

	.data-item {
		display: flex;
		align-items: center;
		justify-content: space-around;
		margin-top: 20rpx;

		.item-name {
			flex: 1;
			height: 100%;
			display: flex;
		}

		.item-value {
			flex: 1;
			height: 100%;
		}

		.item-btn {
			width: 140rpx;
			height: 100%;
			// border: 1px solid #333;
			border-radius: 10rpx;
			box-sizing: border-box;
			display: flex;
			justify-content: center;
			align-items: center;
			background: linear-gradient(90deg, rgba(255, 93, 56, 1) 0%, rgba(252, 135, 109, 0.96) 100%);
			color: #fff;
		}
	}

	.message-recording {
		width: 100%;
		height: 250rpx;
		// background-color: #333
		display: flex;
		justify-content: space-around;
		align-items: center;
	}

	.recording-item {
		width: 30%;
		height: 150rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
</style>